/*
*Description:   Theme CSS
*Author:    toyean
*Website:   http://www.toyean.com/
*Mail:      toyean@qq.com
*Version:   4.5(2021-05-24)
*/
@fz:16px;
@c:#0188fb;
@subc:#333;
@greyc:#888;
@borderc:#e4e8eb;

a,img,button,input,textarea{-webkit-tap-highlight-color:rgba(255,255,255,0);}
html,body,div,span,applet,object,iframe,h1,h2,h3,h4,h5,h6,p,blockquote,pre,a,abbr,acronym,address,big,cite,code,del,dfn,em,img,ins,kbd,q,s,samp,small,strike,strong,sub,sup,tt,var,b,u,i,center,dl,dt,dd,ol,ul,li,fieldset,form,label,legend,table,caption,tbody,tfoot,thead,tr,th,td,article,aside,canvas,details,embed,figure,figcaption,footer,header,hgroup,menu,nav,output,ruby,section,summary,time,mark,audio,video{margin:0; padding:0; font-size:100%; border:0; vertical-align:baseline; }
body { font-size:@fz; color:@subc; font-family:Penrose, "PingFang SC", "Hiragino Sans GB", Tahoma, Arial, "Lantinghei SC", "Microsoft YaHei", "simsun", sans-serif;
    &[zoom='scale']:before{ content:'您的浏览器处于缩放状态，页面可能会出现错位，请设置100%大小显示。'; width:100%; font-size:12px; color:#fff; text-align:center; line-height:32px; background:rgba(50,57,65,0.6); position:fixed; bottom:0; left:0; z-index:99; }
}
h1,h2,h3,h4,h5,h6 { font-weight:normal; }
a { color:@c; text-decoration:none; -webkit-transition:background-color .15s linear, color .15s linear; -moz-transition:background-color .15s linear, color .15s linear; -o-transition:background-color .15s linear, color .15s linear; -ms-transition:background-color .15s linear, color .15s linear; transition:background-color .15s linear, color .15s linear;
    &:hover{ color:@c; text-decoration:none;
    }
}
i { font-style:normal; }
ul,ol{ list-style-type:none; }
img { max-width:100%; height:auto; width:auto\9; border:0; -webkit-transform:translateZ(0px); transform:translateZ(0px); -webkit-transition: -webkit-transform 0.2s ease 0s; transition:transform 0.2s ease 0s; }
input,textarea { font-size:16px; font-family:"PingFang SC", -apple-system, BlinkMacSystemFont, Roboto, "Helvetica Neue", Helvetica, Arial, "Hiragino Sans GB", "Source Han Sans", "Noto Sans CJK Sc", "Microsoft YaHei", "Microsoft Jhenghei", sans-serif; outline:0; }
.clear() {
    &::after{ content:""; display:block; clear:both; }
    zoom:1;
}
.fl(@l:left){
    float:@l;
    display:inline;
}
.fr(@r:right){
    float:@r;
    display:inline;
}
.zoom { display:inline-block; vertical-align:top; }
.nowrap { white-space:nowrap; text-overflow:ellipsis; overflow:hidden; }
.clamp(@num:3){ -webkit-box-orient:vertical; -webkit-line-clamp:@num; overflow:hidden; display:-webkit-box; }
@font-face {
    font-family: 'iconfont';
    src: url('fonts/iconfont.eot');
    src: url('fonts/iconfont.eot?#iefix') format('embedded-opentype'),
    url('fonts/iconfont.woff2') format('woff2'),
    url('fonts/iconfont.woff') format('woff'),
    url('fonts/iconfont.ttf') format('truetype'),
    url('fonts/iconfont.svg#iconfont') format('svg');
    font-weight:normal;
    font-style:normal;
}
.shadow { box-shadow:0 1px 2px rgba(0,0,0,.08); }
.hide { display:none !important; }
.wrap { width:60%; margin:0 auto; .clear();
    &per { background:#f1f1f1; position:relative; }
}
.head { padding-left:200px; position:relative; .clear();
    &er { background:#fff; box-shadow:0 1px 4px 0 rgba(238,238,238,0.5); position:relative; z-index:99;
        .name { height:60px; .fl(); white-space:nowrap; text-overflow:ellipsis; overflow:hidden; position:relative; z-index:1;
            a { font-size:28px; color:@subc; line-height:60px; }
        }
        .subname { .fl(); margin:30px 0 0 10px; font-size:16px; color:@subc; }
        &.fixed { border-bottom:1px solid #eee; position:fixed; top:0; width:100%; z-index:99; }
    }
}
.lazyline { height:2px; background-color:@c; position:absolute; top:0; top:2px\0; left:0; z-index:2; }
.lazynum { padding:0 10px; font-size:12px; color:#fff; line-height:20px; border-top-left-radius:10px; border-bottom-left-radius:10px; background:#ccc; position:fixed; right:0; bottom:5px; z-index:100; }
.logo { height:60px; .fl(); overflow:hidden; position:relative; z-index:99;
    a { width:100%; height:60px; display:table-cell; vertical-align:middle; transition:all ease .3s;
        img { height:50px; vertical-align:middle; }
    }
}
.logo.on a::before { content:''; position:absolute; top:0; left:-75%; z-index:2; display:block; width:50%; height:100%; background:-webkit-linear-gradient(left, rgba(255, 255, 255, 0) 0%, rgba(255, 255, 255, .5) 100%); background:linear-gradient(to right, rgba(255, 255, 255, 0) 0%, rgba(255, 255, 255, .5) 100%); -webkit-transform:skewX(-17deg); -moz-transform:skewX(-17deg); -o-transform:skewX(-17deg); -ms-transform:skewX(-17deg); transform:skewX(-17deg); }
.logo a:hover::before { -webkit-animation:shine 1s; -moz-animation:shine 1s; animation:shine 1s; }
@-webkit-keyframes shine { 100% { left:125%; } }
@keyframes shine { 100% { left:125%; } }

.nav { border-bottom:1px solid #ddd; border-image:-webkit-linear-gradient(right,#e2e2e2 20%,white 100%) 100 100 100 100; border-image:-moz-linear-gradient(right,#e2e2e2 20%,white 100%) 100 100 100 100; border-image:linear-gradient(right,#e2e2e2 20%,white 100%) 100 100 100 100;
    dl { padding-right:50px; line-height:35px; font-size:0; text-align:right;
        dd { margin:0 10px; font-size:14px; color:@subc; .zoom;
            a { color:@subc; }
        }
    }
}

.account { .fr(); }
.sign { .fl(); font-size:14px; line-height:60px;
    span { margin:15px 0 0 10px; line-height:28px; overflow:hidden; .zoom;
        a { margin:0 10px 0 0; padding:0 14px; font-size:14px; color:@c; line-height:28px; border:1px solid @c; border-radius:15px; display:inline-block;
            &:hover { color:#fff; background:@c; }
        }
    }
    &user { margin-left:10px; padding:13px 13px 0; font-size:0; line-height:45px; border-top:2px solid transparent; position:relative; .zoom;
        .uimg { position:relative; .zoom;
            img { width:30px; height:30px; border-radius:50%; .zoom; }
            i { width:14px; height:14px; line-height:14px; text-align:center; border-radius:7px; background:#ccc; position:absolute; right:-3px; top:20px; z-index:2;
                &.vip { background:@c; }
                &::after { content:"V"; font-size:12px; color:#fff; font-family:iconfont; }
            }
        }
        .uname { width:70px; margin-left:8px; font-size:14px; color:@subc; line-height:30px; text-overflow:ellipsis; white-space:nowrap; overflow:hidden; .zoom; }
        &.normal:hover { border-color:@c; background:#fff;
            .signuserpop { display:block; }
        }
        &.simple:hover { border-color:transparent;
            .signuserpop { display:none; }
        }
        &menu { text-align:center; line-height:36px; position:relative; z-index:1;
            a { padding:0 10px; font-size:14px; color:@subc; display:block;
                &:hover { color:@c; background:#f0f0f0; }
            }
        }
        &pop { width:100%; padding-top:0px; box-shadow:0 2px 24px 0 rgba(0,0,0,.08); user-select:none; background:#fff; position:absolute; top:56px; right:0; z-index:-1; display:none; }
    }
}
.menu { .fr(); line-height:60px; position:relative;
    ul { padding-right:35px; .clear();
        &.nosch { padding:0; }
    }
    li { .fl(); margin:0 30px 0 0; position:relative;
        a { font-size:16px; color:@subc; position:relative; display:inline-block;
            &:hover { color:@c; }
        }
        &::before { content:""; width:0; height:3px; border-radius:3px 3px 0 0; opacity:.1; background:@c; position:absolute; left:50%; bottom:0px; -webkit-transition:all .2s; -moz-transition:all .2s; -o-transition:all .2s; transition:all .2s; }
        &:hover,&.on {
            &::before { width:32px; margin-left:-16px; opacity:1; }
            a { color:@c; }
        }
        .subnav { min-width:200px; padding:10px 0; line-height:40px; border-top:1px solid @c; box-shadow:0 2px 2px 0 #ddd; background:#fff; position:absolute; top:60px; left:-20px; z-index:99; display:none; -webkit-animation:fadeInUp .3s 0s ease both; -moz-animation:fadeInUp .3s 0s ease both;
            a { padding:0 20px; font-size:14px; border-bottom:1px solid #f5f5f5; white-space:nowrap; text-overflow:ellipsis; overflow:hidden; display:block;
                &::after { content:"\e6a6"; font-size:16px; color:#ccc; font-family:iconfont; font-weight:600; position:absolute; top:0; right:15px; vertical-align:top; -moz-transition:opacity .5s; -o-transition:opacity .5s; -webkit-transition:opacity .5s; transition:opacity .5s; }
                &:hover {
                    &::after { color:@c; }
                }
                &.on { color:@c;
                    &::after { opacity:1; }
                }
                &:last-child { border:0; }
            }
            &::before { content:""; width:0; height:0; margin:-21px 0 0 0; border:10px solid transparent; border-bottom-color:@c; position:absolute; top:0; left:26px; z-index:3; }
            &::after { content:""; width:0; height:0; margin:-20px 0 0 0; border:10px solid transparent; border-bottom-color:#fff; position:absolute; top:0; left:26px; z-index:3; }
        }
        &.subcate {
            &:hover {
                a { color:@c; }
                &::before { display:none; }
                .subnav { display:block;
                    a {
                        &:hover { color:@c; }
                        &.on { color:@c;
                            &::after { color:@c; }
                        }
                    }
                }
            }
            .subnav a { color:@subc; }
        }
    }
    &.on { width:100%; .fl(); margin:0 -20px; padding:10px 20px 0; border-top:1px solid @borderc; background:#fff; position:absolute; top:50px; z-index:9; display:block;
        li { width:100%; float:none; line-height:40px; border-bottom:1px dotted @borderc; display:block;
            a { display:block; }
        }
    }
    &ico { width:38px; height:38px; float:right; border-radius:2px; cursor:pointer; position:relative; z-index:10; top:6px; display:none; -webkit-transition:all 0.2s ease-in; -moz-transition:all 0.2s ease-in; -o-transition:all 0.2s ease-in; transition:all 0.2s ease-in; }
    &ico span { width:21px; height:2px; background-color:@c; position:absolute; top:50%; left:50%; display:block; -webkit-transform:translateX(-50%) translateY(-50%); -moz-transform:translateX(-50%) translateY(-50%); transform:translateX(-50%) translateY(-50%); -webkit-transition:all 0.1s ease-in; -moz-transition:all 0.1s ease-in; -o-transition:all 0.1s ease-in; transition:all 0.1s ease-in; }
    &ico span:first-child { margin-top:-6px; }
    &ico span:last-child { margin-top:6px; }
    &ico.on span:first-child { width:20px; margin-top:-8px; margin-left:-7px; -webkit-transform:rotate(45deg); -moz-transform:rotate(45deg); transform:rotate(45deg); }
    &ico.on span:nth-child(2) { opacity:0; width: 2px; left: 20px; -moz-transition-delay: 0s; -o-transition-delay: 0s; -webkit-transition-delay: 0s; transition-delay: 0s; -webkit-transition:all 0.1s ease-in; -moz-transition:all 0.1s ease-in; -o-transition:all 0.1s ease-in; transition:all 0.1s ease-in; }
    &ico.on span { background-color:@subc; -webkit-transform-origin:0; -moz-transform-origin:0; transform-origin:0; }
    &ico.on span:last-child { width:20px; margin-top:6px; margin-left:-7px; -webkit-transform:rotate(-45deg); -moz-transform:rotate(-45deg); transform:rotate(-45deg); }
}

.fademask.on { width:100%; height:100%; background:rgba(0,0,0,.5); position:fixed; top:0; right:0; bottom:0; left:0; z-index:2; }
.sch { display:inline-block;
    &ico { width:45px; height:60px; line-height:62px; text-align:center; cursor:pointer; position:absolute; top:0; right:0; transition:all ease .3s;
        a { height:60px; display:block;
            &::after { content:"\e6e1"; font-size:30px; color:@greyc; font-weight:bold; font-family:iconfont; }
        }
    }
    &-m { line-height:0; position:relative; display:none;
        input { width:100%; height:50px; padding:0 18px; font-size:18px; color:@subc; line-height:50px; border:0; outline:0; border-bottom:2px solid @c; border-radius:3px; box-sizing:border-box; background:transparent;
            &:focus { color:@c; }
        }
        button { width:30px; height:30px; padding:0; border:0; outline:0; cursor:pointer; background:transparent; position:absolute; bottom:10px; right:10px;
            &::after { content:"\e6e1"; font-size:30px; color:@c; font-family:iconfont; font-weight:600; .zoom; }
        }
    }
    &fixed { width:262px; padding:20px; border-top:1px solid @c; box-shadow:0 0 2px 0 #ddd; background:#fff; position:absolute; top:60px; right:0; z-index:10; display:none;
        &::before { content:""; width:0; height:0; margin:-20px 0 0 0; border:10px solid transparent; border-bottom-color:@c; position:absolute; top:0; right:14px; z-index:3; }
        &::after { content:""; width:0; height:0; margin:-19px 0 0 0; border:10px solid transparent; border-bottom-color:#fff; position:absolute; top:0; right:14px; z-index:3; }
        form { position:relative; .clear(); }
        input { width:100%; height:38px; .fl(); padding:0 38px 0 10px; font-size:14px; color:@subc; line-height:36px; border:1px solid @borderc; outline:0; border-radius:3px; box-sizing:border-box; background:#fff;
            &:focus { color:@c; background-color:#fff; border-color:#aab7c1; outline:0; box-shadow:0 0 0 0.2rem rgba(31, 73, 119, 0.1); }
        }
        button { width:38px; height:38px; padding:0; line-height:38px; border:0; border-radius:0 3px 3px 0; outline:0; cursor:pointer; background:@c; position:absolute; top:0; right:0;
            &::after { content:"\e6e1"; font-size:26px; color:#fff; font-family:iconfont; .zoom; }
        }
        &.on { display:block; }
    }
    &box { width:100%; height:100%; position:fixed; top:0; left:0; z-index:11; display:none;
        &.on { display:block; }
    }
    &bg { background:rgba(0,0,0,.9); position:absolute; top:0; right:0; bottom:0; left:0; z-index:1; }
    &close { font-size:40px; color:@c; font-family:iconfont; cursor:pointer; position:absolute; top:0; right:40px; z-index:2; }
    &form { width:600px; position:absolute; top:100px; left:50%; z-index:2; transform:translate(-50%, 0%);
        form { position:relative; }
        input { width:100%; font-size:22px; color:@c; line-height:50px; border:0; outline:0; border-bottom:2px solid @c; border-radius:3px; background:transparent;
            &:focus { color:#495057; background-color:#fff; border-color:#aab7c1; outline:0; box-shadow:0 0 0 0.2rem rgba(31, 73, 119, 0.1); }
        }
        button { width:39px; height:39px; border:0; outline:0; cursor:pointer; background:transparent; position:absolute; bottom:8px; right:0;
            &::after { content:"\e077"; font-size:28px; color:@c; font-family:iconfont; .zoom; }
        }
    }
    &ads { margin-top:30px;
        h3 { margin:10px 0; font-size:15px; color:@borderc; line-height:30px; }
        a { margin-bottom:10px; display:block; }
    }
}
.searchnull { padding:20% 0; color:@greyc; text-align:center;
    &::before { content:"\e869"; margin-bottom:10px; font-size:100px; color:@borderc; font-family:iconfont; display:block; }
    a { border-bottom:1px solid @c; }
}

.main { padding-bottom:20px; background:#f1f1f1;
    .mask { margin-bottom:20px; }
    &.fixed { padding-top:60px; }
    .block:last-child { margin-bottom:0; }
}

.slide { width:100%; text-align:center; position:relative; overflow:hidden;
    a { text-align:center; display:block;
        img { margin:0 auto; display:block; }
    }
    &url { width:100%; height:100%; display:block; }
    &block { margin-bottom:20px; border-radius:3px; box-shadow:0 1px 5px 0 rgba(0, 0, 0, 0.05); box-sizing:border-box; background:#fff; overflow:hidden; }
}
.swiper-slide { background-repeat:no-repeat; background-size:cover; background-position:center; }
.swiper-container-horizontal>.swiper-pagination-bullets, .swiper-pagination-custom, .swiper-pagination-fraction { bottom:10px; }
.swiper-pagination-bullet { width:30px; height:3px; margin:0 5px; padding:14px 0; border-radius:0; opacity:.8; background-color:#fff; background-clip:content-box; vertical-align:top; }
.swiper-pagination-bullet-active { background-color:@c; }
.swiper-button-next, .swiper-container-rtl .swiper-button-prev { right:0px; }
.swiper-button-prev, .swiper-container-rtl .swiper-button-next { left:0px; }
.swiper-button-prev,.swiper-button-next { margin-top:-32px; padding:10px 16px; border-radius:5px; opacity:.5; background-color:rgba(68,68,68,.5); background-size:30%; z-index:99;
    &:hover { opacity:.8; background-color:rgba(68,68,68,1); }
}

.banner { padding:0 18px; font-size:40px; color:#fff; text-align:center; background-repeat:no-repeat; background-position:50% 0; background-size:cover; overflow:hidden; position:relative;
    &::before { content:""; width:100%; height:100%; background:none; position:absolute; top:0; left:0; z-index:1; }
    h2 { margin-bottom:20px; text-shadow:0px 1px 5px #999; word-break:break-all; position:absolute; top:50%; left:50%; transform:translate(-50%, -50%); z-index:2;
        &::after { content:""; width:40px; height:2px; margin-left:-20px; background:#fff; position:absolute; left:50%; bottom:-20px; }
    }
}
.display { background-size:cover; }
.loader { width:50px; height:50px; margin:-25px 0 0 -25px; border-top:1px solid rgba(0, 0, 0, 0.08); border-right:1px solid rgba(0, 0, 0, 0.08); border-bottom:1px solid rgba(0, 0, 0, 0.08); border-left:1px solid rgba(0, 0, 0, 0.5); border-radius:50%; position:absolute; top:50%; left:50%; z-index:20; -webkit-animation:loader 700ms infinite linear; animation:loader 700ms infinite linear; }
@keyframes loader {
    0% {
        transform: rotate(0deg);
    }

    100% {
        transform: rotate(360deg);
    }
}
.indexcon { padding-top:20px; background:#f1f1f1; position:relative; z-index:2;
    .swiper-container-horizontal>.swiper-pagination-bullets, .swiper-pagination-custom, .swiper-pagination-fraction { bottom:5px; }
    .swiper-button-prev,.swiper-button-next { margin-top:-22px; padding:0; border-radius:0; opacity:.3; background:#333;
        &::after { font-size:28px; color:#fff; font-family:iconfont; text-align:center; line-height:45px; display:block; }
        &:hover { opacity:1;
            &::after { background:@c; }
        }
    }
    .swiper-button-prev { left:0; border-radius:0 3px 3px 0;
        &::after { content:"\e6dc"; border-radius:0 3px 3px 0; }
    }
    .swiper-button-next { right:0; border-radius:3px 0 0 3px;
        &::after { content:"\e6a6"; border-radius:3px 0 0 3px; }
    }
}
.sitemap { margin-bottom:5px; font-size:14px; color:@greyc; line-height:24px;
    a { font-size:14px; color:@greyc;
        &:hover { color:@c; }
    }
}
.content { width:70%; .fl();
    &.wide { width:100%; }
}
.block { margin-bottom:20px; padding:20px 30px; word-break:break-all; border-radius:3px; box-shadow:0 1px 5px 0 rgba(0, 0, 0, 0.05); box-sizing:border-box; background:#fff;
    .post:last-child { margin-bottom:0; padding-bottom:0; border:0; }
    .cmtsitem:last-child { padding-bottom:0; border-bottom:0; }
    &#divCommentPost { margin-bottom:0; }
}

.post { margin-bottom:20px; padding-bottom:20px; border-bottom:1px solid @borderc; .clear();
    h1 { margin:8px 0; font-size:24px; color:@subc; font-weight:700; line-height:36px; }
    h2 { margin-bottom:5px; line-height:36px; font-weight:700;
        a { font-size:22px; color:@subc;
            &:hover { color:@c; }
        }
        span { margin-right:5px; .zoom;
            &::before { font-family:iconfont; font-weight:normal; vertical-align:top; }
        }
        .istop { margin-right:-10px; color:@c; vertical-align:top;
            &::before { content:"\e67a"; font-size:42px; }
        }
        .zbaudio {
            &::before { content:"\e616"; font-size:26px; }
        }
        .video {
            &::before { content:"\e6dd"; font-size:26px; }
        }
    }
    .info { margin-bottom:15px; font-size:14px; .clear();
        &.simple { margin:0; }
    }
    .user,.date,.cate,.view,.cmt,.edit,.del { margin-right:15px; color:@greyc;
        &::before { margin-right:5px; font-size:18px; font-family:iconfont; vertical-align:top; }
        a { color:@greyc;
            &:hover { color:@c; }
        }
    }
    .user:before { content:"\e6a9"; }
    .date:before { content:"\e69c"; }
    .cate:before { content:"\e6e2"; }
    .view:before { content:"\e6a7"; }
    .cmt:before { content:"\e6a8"; }
    .edit:before { content:"\e69a"; }
    .del:before { content:"\e6ac"; }
    .ctrl { .fr(); display:inline-block;
        a { width:21px; height:20px; margin:0 0 0 8px; text-align:center; line-height:20px; border-radius:2px; background:@borderc; .zoom;
            &::before { content:"A⁺"; font-size:16px; color:#999; font-family:iconfont; }
            &:nth-child(2) {&::before { content:"A⁻"; }}
            &:nth-child(3) {&::before { content:"A"; }}
        }
    }
    &img { width:120px; .fl(); margin:0 20px 10px 0; border-radius:3px; overflow:hidden;
        a { width:100%; height:0; padding-bottom:70%; text-align:center; overflow:hidden; position:relative; display:block;
            img { min-width:100%; min-height:100%; position:absolute; top:0; left:0; }
        }
        &:hover img { -moz-transform:scale(1.1); -o-transform:scale(1.1); transform:scale(1.1); }
        &.v a::before { content:""; width:32px; height:32px; background:url("data:image/svg+xml;charset=utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' width='32' height='32' viewBox='0 0 48 48'%3E  %3Cg fill='none' fill-rule='evenodd'%3E    %3Ccircle cx='24' cy='24' r='24' fill='%23000' fill-opacity='.15'/%3E    %3Cpath fill='%23FFF' fill-rule='nonzero' d='M24 0c13.255 0 24 10.745 24 24S37.255 48 24 48 0 37.255 0 24 10.745 0 24 0zm0 1.44C11.54 1.44 1.44 11.54 1.44 24c0 12.46 10.1 22.56 22.56 22.56 12.46 0 22.56-10.1 22.56-22.56 0-12.46-10.1-22.56-22.56-22.56zm-4.8 13.828a1.2 1.2 0 0 1 .595.158l13.182 7.532a1.2 1.2 0 0 1 0 2.084l-13.182 7.532A1.2 1.2 0 0 1 18 31.532V16.468a1.2 1.2 0 0 1 1.2-1.2z'/%3E  %3C/g%3E%3C/svg%3E"); background-size:cover; position:absolute; top:50%; left:50%; transform:translate(-50%,-50%); z-index:1; }
    }
    .intro { max-height:85px; margin-bottom:10px; font-size:@fz; color:@greyc; line-height:28px; word-wrap:break-word; word-break:break-all; text-align:justify; text-justify:inter-ideograph; .clamp(3);
        a { color:@greyc; }
    }
    object,embed,iframe,table { max-width:100%; }
    .readmore { padding:5px 16px 5px 26px; font-size:14px; color:@greyc; border:2px solid @borderc; border-radius:20px; display:inline-block;
        &::after { content:"\e6a6"; margin-left:5px; font-family:iconfont; }
        &:hover { color:@c; border-color:@c;
            &::after { color:@c; }
        }
    }
    &title { padding:0 0 10px; line-height:30px; border-bottom:1px solid @borderc;
        h1,h2,h3,h4,h5,h6 { font-size:20px; color:@subc; }
    }
    .tags { margin-bottom:6px; font-size:15px; color:@greyc; text-indent:0;
        a { margin:0 5px 10px; padding:0 12px; font-size:15px; color:@subc; line-height:24px; border:1px solid @borderc; border-radius:26px; display:inline-block;
            &:hover { color:@c; border:1px solid @c; }
        }
    }
    mark { color:@c; background:none; }
}

.large {
    .post {
        &img { width:160px; }
        .intro { max-height:110px; .clamp(4); }
    }
}

.auth { .clear();
    &img { width:96px; height:96px; .fl(); border:3px solid rgba(0,0,0,.1); border-radius:50%; position:relative;
        img { width:96px; height:96px; border-radius:50%; }
        .sex { width:20px; height:20px; text-align:center; font-style:normal; line-height:20px; border:2px solid @c; border-radius:50%; background:rgba(255,255,255,1); position:absolute; bottom:2px; right:2px;
            &::before { content:"\e78d"; font-size:20px; color:@c; font-family:iconfont; vertical-align:middle; }
            &.female { border-color:#fb6c7f;
                &::before { content:"\e78c"; color:#fb6c7f; }
            }
        }
    }
    &info { padding-left:126px;
        h1 { margin-bottom:5px; font-size:24px;
            span { margin-left:5px; padding:0 5px; font-size:12px; color:#fff; border-radius:2px; background:@c; vertical-align:middle; }
        }
        p { margin-bottom:10px; font-size:16px; color:#888; line-height:1.8; }
        span { margin-right:10px; font-size:14px; color:#888; .zoom;
            &::before { font-size:18px; font-family:iconfont; .zoom; }
        }
        .cate:before { content:"\e6e2"; }
        .view:before { content:"\e6a7"; }
        .cmt:before { content:"\e6a8"; }
    }
}

.filter {
    &nav { margin-bottom:20px; padding-bottom:14px; border-bottom:1px solid @borderc;
        h1 { font-size:18px; .zoom; }
        ul { .fr(); font-size:0; }
        li { .fl(); padding:0 0 0 10px; font-size:16px; line-height:25px; cursor:pointer; position:relative;
            &.active { color:@c;
                i { display:inline;
                    &::before { color:@c; }
                }
                &::after { content:""; width:100%; height:2px; background:@c; position:absolute; bottom:-15px; left:0; }
            }
            i { width:16px; margin-right:3px; .zoom;
                &::before { content:"\e605"; font-size:16px; font-family:iconfont; }
            }
            &:hover { color:@c; }
        }
    }
}

.pagebar,.cmtpagebar { width:100%; margin:0 auto; padding:15px 0 10px; font-size:0; text-align:center; border-radius:3px; box-sizing:border-box; background:#fff; }
.pagebar .now-page,.cmtpagebar .now-page { font-size:14px; color:#fff; font-weight:400; padding:5px 10px; margin:0 5px 5px; border:1px solid @c; border-radius:2px; background:@c; display:inline-block; }
.pagebar a,.cmtpagebar a { margin:2px; padding:5px 10px; font-size:14px; color:#777; font-weight:400; border:1px solid #e2e2e2; border-radius:2px; background:#fff; display:inline-block; }
.pagebar a:hover,.cmtpagebar a:hover { color:#fff; border:1px solid @c; background:@c; }
.pagebar { box-shadow:0 1px 5px 0 rgba(0, 0, 0, 0.05); }
.cmtpagebar { padding-bottom:0; }
.pagination-loading { margin:0 0 20px; text-align:center; border-radius:2px; background:#ebebeb;
    a { padding:10px 0; border:1px solid @borderc; display:block; }
}
.ias_trigger,.ias_loader { margin:0 0 20px; font-size:16px; color:@greyc;
    a { padding:10px 0; font-size:16px; color:#666; text-align:center; border:1px solid @borderc; background:#fff; display:block;
        &:hover { color:@greyc; background:@borderc; }
    }
}
.ias_loader { line-height:44px; }

.friendlink { margin-top:20px; padding:20px 30px 10px; font-size:0; border-radius:3px; box-shadow:0 1px 5px 0 rgba(0, 0, 0, 0.05); box-sizing:border-box; background:#fff;
    span { margin-bottom:10px; padding-bottom:10px; font-size:20px; color:@subc; border-bottom:1px solid #e4e8eb; display:block; }
    li { margin:0 20px 10px 0; .zoom;
        a { font-size:14px; color:@subc;
            &:hover { color:@c; }
        }
    }
}

.con {
    &title { margin-bottom:30px; line-height:38px; border-bottom:1px solid @borderc; background:#fff;
        h1,h2 { margin-bottom: -1px; font-size: 16px; border-bottom: 1px solid @c; display: inline-block; vertical-align: top; }
    }
}

.single { padding:20px 0 0; line-height:1.9; border-top:1px dotted @borderc; word-wrap:break-word; word-break:break-all; overflow:hidden;
    ul,ol { margin-bottom:20px; list-style-position:inside;
        p { display:inline; }
    }
    p { margin-bottom:1em; text-align:justify; text-justify:inter-ideograph; position:relative;
        img.ue-image { margin:0 auto; }
        img.ue-emoticon { vertical-align:middle; }
        &.ue-upload { padding:10px; border:1px dashed @borderc;
            img { vertical-align:top!important; }
            a { font-size:14px!important; color:@c!important; }
        }
    }
    h1,h2,h3,h4,h5,h6 { margin-bottom:20px; padding:24px 0 10px; line-height:1.5; border-bottom:1px solid @borderc; position:relative;
        &::after { content:""; width:24px; height:0; border-bottom:2px solid @c; position:absolute; left:0; bottom:-1px; }
    }
    h1 { font-size:32px; }
    h2 { font-size:28px; }
    h3 { font-size:24px; }
    h4 { font-size:22px; }
    h5 { font-size:18px; }
    h6 { font-size:16px; }
    blockquote { margin-bottom:20px; padding:10px 20px 10px 50px; font-size:14px; color:#666; line-height:1.8; border:1px dotted #ccc; background:#f8f8f8; position:relative;
        &::before { content:"“"; font-size:70px; color:@borderc; font-family:arial; line-height:1; position:absolute; top:5px; left:14px; }
        p { margin:0; }
    }
    table { margin-bottom:20px; font-size:14px; border-collapse:collapse; border-spacing:0; }
    .th { width:100px; background:#f5f5f5; }
    td { padding:5px 10px; color:#666; line-height:24px; word-break:break-all; border:1px solid @borderc; }
    div.prism-show-language > div.prism-show-language-label[data-language] { font-size:14px; }
    span.prism-token { background:none!important; }
    code[class*="language-"], pre[class*="language-"] { color:inherit; }
    pre[class*="language-"] { margin-bottom:20px; font-size:14px; }
    &.indent {
        p,ol,ul { text-indent:2em; }
        blockquote p { text-indent:0; }
    }
}
.video {
    &wrap { overflow:hidden; }
    &box { width:100%; height:0; padding-bottom:56.25%; position:relative; display:block;
        object,video,embed,iframe { width:100%; height:100%; outline:0; position:absolute; display:block;
            video { width:100%; }
        }
        video { background:#262626; }
    }
}
.copynotice { width:100%; margin:20px 0; padding:10px 15px; font-size:14px; color:@greyc; text-indent:0; line-height:22px; border:1px dotted #ccc; border-radius:3px; box-sizing:border-box; background:#f8f8f8; overflow:hidden; display:flex; .clear(); -webkit-justify-content:center; justify-content:center; -webkit-align-items:flex-end; align-items:center;
    .qr,canvas { width:70px; height:70px; .fl(); margin-right:15px; border:3px solid #fff; background:#fff; }
    b,strong { margin:0 5px; color:@subc; }
    &txt { width:100%; word-break:break-all; vertical-align:middle;
        p { margin:0; }
        a { color:@subc; }
    }
}
.sharebox {
    .label { font-size:14px; color:#999; line-height:30px; }
    .label,.sharebtn { display:inline-block; }
}
.pages { margin-top:20px; overflow:hidden; .clear();
    a { color:@subc;
        &:hover { color:@c; }
    }
    p { height:30px; color:#999; white-space:nowrap; text-overflow:ellipsis; overflow:hidden; }
    span { color:@greyc; }
}
a.backlist { .fr(); margin:10px 0 0; padding:5px 10px 5px 20px; color:@greyc; border:2px solid @borderc; border-radius:20px; display:inline-block;
    &::after { content:"\e6a6"; margin-left:5px; font-family:iconfont; }
    &:hover { color:@c; border-color:@c; }
}

.relate { padding:20px 0; border-top:1px dotted @borderc; overflow:hidden; .clear();
    &con {
        .relate:first-child { border:0; }
        &.onlyone { margin-top:15px; }
        &.diallel { margin-top:10px; .clear();
            .relatelist { width:47%; .fl();
                &:nth-child(even){ .fr(); }
            }
            .datetime { display:none; }
        }
    }
    &list { margin-top:5px; padding-bottom:5px; font-size:12px; color:#999; line-height:27px; border-bottom:1px dotted @borderc; position:relative;
        a { width:75%; margin-right:20px; font-size:16px; color:#333; white-space:nowrap; text-overflow:ellipsis; overflow:hidden; .zoom;
            &:hover { color:@c; }
        }
        .posttime { font-size:14px; color:#bbb; position:absolute; top:0; right:0; }
    }
    &:last-child { padding:20px 0 0; }
}
.relateinfo {
    h3 { margin:0 0 10px; color:#333; .clamp(1);
        a { font-size:18px; color:#333; font-weight:700;
            &:hover { color:@c; }
        }
    }
    p { max-height:47px; font-size:15px; color:@greyc; line-height:26px; overflow:hidden; -webkit-box-orient:vertical; -webkit-line-clamp:2; overflow:hidden; display:-webkit-box;
        a { color:@greyc; }
    }
}
.relateimg { width:120px; .fl(); margin-right:20px;
    a { width:100%; height:0; padding-bottom:70%; border-radius:3px; overflow:hidden; position:relative; display:block;
        img { width:100%; min-height:100%; position:absolute; top:0; left:0; }
    }
    &:hover img { -moz-transform:scale(1.1); -o-transform:scale(1.1); transform:scale(1.1); }
}

.cmt {
    &s {
        &item { padding:18px 0 14px; border-bottom:1px dotted @borderc; .clear();
            .avatar { width:48px; height:48px; .fl(); margin-right:10px; overflow:hidden;
                img { width:48px; height:48px; border-radius:3px; }
            }
            .cmtscon {
                .avatar { display:none; }
            }
        }
        &con { margin-left:65px; .clear();
            &>.cmtsitem { margin-top:15px; padding:0 0 0 20px; border-left:2px solid #e4e8eb;
             .cmtscon { margin:0; }
            }
        }
        &head {  }
        &date { .fr(); font-size:14px; color:#bbb; }
        &name { font-size:14px; color:@subc; display:inline-block;
            a { font-size:14px; color:@subc }
        }
        &body { margin-top:8px; line-height:26px; word-wrap:break-word; word-break:break-all;
            .cmtscon { margin:0; padding-left:20px; border-left:2px solid @borderc; }
            .cmtsfoot { .hide(); }
        }
        &reply { margin-top:15px; padding-left:20px; border-left:2px solid @borderc;
            &name { font-size:14px; color:@greyc;
                a { font-size:14px; color:@subc; }
            }
            &con { margin-top:8px; word-wrap:break-word; word-break:break-all; }
            &date { margin-top:8px; font-size:14px; color:#bbb; }
        }
        &foot { margin-top:8px;
            .reply { font-size:14px; color:@greyc;
                &::before { content:"\e6a8"; margin-right:3px; font-size:22px; color:@greyc; font-family:iconfont; vertical-align:top; }
                &:hover { color:@c;
                    &::before { color:@c; }
                }
            }
        }
        &.nocmt { padding:15px 30px;
            &::before { content:attr(data-content); width:100%; font-size:16px; color:@greyc; text-align:center; display:inline-block; }
        }
    }
}
.reply-frm { border-left:2px solid @borderc; padding:0 0 0 20px; margin-top:15px; box-shadow:none;
    .cmtimg { .hide(); }
    .cmtarea { padding:0; }
}
#cancel-reply { font-size:14px; height:26px; margin-left:20px; padding:0 10px 0 6px; font-size:14px; color:@c; line-height:25px; border:2px solid @c; outline:0; box-sizing:content-box; border-radius:20px; cursor:pointer; background:#fff; vertical-align:top; display:none;
    &::before { content:"\e6db"; margin-right:3px; font-size:23px; color:@c; font-family:iconfont; vertical-align:sub; }
}
.comment { margin-top:20px; .clear(); }
.cmtimg { width:48px; float:left; text-align:center;
    img { width:48px; height:48px; border-radius:3px; }
    p { height:20px; font-size:12px; color:@greyc; text-overflow:ellipsis; white-space:nowrap; overflow:hidden; }
}
.cmtinfo { padding-left:70px; font-size:14px; word-break:break-all;
    a { color:@subc; }
    .cmt { margin:15px 0 0 -20px; padding-bottom:0;
        .cmt { margin:15px 0 0 -20px; padding-bottom:0;
            .cmt { margin:15px 0 0 -20px; padding-bottom:0; }
        }
    }
    .cmtinfo { width:500px;
        .cmtinfo { width:430px;
            .cmtinfo { width:360px; }
        }
    }
}
.cmttime,.cmttime a { font-size:12px; color:@greyc; }
.cmtarea { padding-left:68px;
    textarea { width:100%; margin:0 0 10px; padding:5px 15px; font-size:16px; color:@subc; line-height:28px; border:1px solid @borderc; outline:0; border-radius:3px; overflow:hidden; vertical-align:top; box-sizing:border-box;
        &:focus { color:@c; background-color:#fff; border-color:#aab7c1; outline:0; box-shadow:0 0 0 0.2rem rgba(31, 73, 119, 0.1); }
    }
}
.cmtsubmit {
    button { height:36px; margin:0 10px 0 0; padding:0 20px; font-size:16px; color:@greyc; line-height:32px; border:2px solid @borderc; outline:0; border-radius:20px; cursor:pointer; background:#fff;
        &::before { content:"\e69a"; margin-right:3px; font-size:23px; color:@greyc; font-family:iconfont; vertical-align:top; }
        &:hover { color:@c; border-color:@c;
            &::before { color:@c; }
        }
        &:active { border-color:@c; background:#f1f1f1; }
    }
    span { font-size:14px; color:@greyc; }
}
.cmtform { width:100%; float:left; margin:0 0 20px; padding:0 0 20px; border-bottom:1px dotted @borderc; display:none; }
.cmtform p { width:49%; float:left; padding:5px 0; }
.cmtform input { width:180px; height:27px; padding:2px 6px; color:@subc; border:1px solid @borderc; outline:0; border-radius:3px; 
    &:focus { color:@c; background-color:#fff; border-color:#aab7c1; outline:0; box-shadow:0 0 0 0.2rem rgba(31, 73, 119, 0.1); }
}
.cmtform input { *display:inline; }
.cmtform label { padding:0 10px; line-height:27px; cursor:pointer; }
.cmtform #inpVerify { width:100px; }
.cmtform img.imgcode { width:68px; height:31px; margin-left:10px; border:1px solid @borderc; cursor:pointer; vertical-align:top; }

.side {
    &bar { width:28%; .fr();
        & ::marker { content:""; }
        &.fixed {
            .sidebox.fixed { top:75px; }
        }
    }
    &box { margin-bottom:20px; padding:20px; word-break:break-all; border-radius:3px; box-shadow:0 1px 5px 0 rgba(0, 0, 0, 0.05); box-sizing:border-box; background:#fff;
        dd { line-height:30px;
            ul { overflow:hidden; .clear(); }
            li { border-bottom:1px dotted @borderc; }
            a { color:@subc;
                &:hover { color:@c; }
            }
            .sidelink a { color:#fff;
                &:hover { color:#fff; }
            }
            .noimg {
                .sidelink a { font-size:16px; color:@subc;
                    &:hover { color:@c; }
                }
            }
            .sidecmtcon { color:#888;
                a { color:#888; }
            }
        }
        &.fixed{ position:fixed; top:0; -webkit-transform:translateZ(0); }
        &.sticky { position:absolute; }
        //&:last-child { margin:0; }
    }
    &title { margin-bottom:10px; padding:0 0 10px; font-size:20px; border-bottom:1px solid @borderc; }
    &item { margin-bottom:10px; padding-bottom:8px; line-height:26px; border-bottom:1px dotted @borderc; border-radius:3px; overflow:hidden; position:relative; .clear();
        &:last-child { margin:0; }
        &img { background:@subc;
            a { width:100%; height:0; padding-bottom:70%; text-align:center; overflow:hidden; position:relative; display:block;
                img { min-width:100%; min-height:100%; opacity:1; position:absolute; top:0; left:0; -webkit-transition:opacity 0.3s ease-in-out; -moz-transition:opacity 0.3s ease-in-out; -o-transition:opacity 0.3s ease-in-out; transition:opacity 0.3s ease-in-out; }
            }
        }
        &:hover {
            .sideitemimg img { opacity:.8; }
            .sidelink { bottom:0; }
        }
        .itemtitle { max-height:52px; overflow:hidden;  display:-webkit-box; -webkit-box-orient:vertical; -webkit-line-clamp:2; }
        .hasimg { white-space:nowrap; text-overflow:ellipsis; overflow:hidden;
            a { display:inline; }
        }
        &.noimg {
            .itemtitle { color:@subc; }
            .sideinfo { color:@greyc; }
            .sidelink { padding:0; background:none; position:static; }
        }
    }
    &img { width:70px; .fl(); margin-right:10px; border-radius:3px; overflow:hidden;
        a { width:100%; height:0; padding-bottom:70%; text-align:center; overflow:hidden; position:relative; display:block;
            img { min-width:100%; min-height:100%; opacity:1; position:absolute; top:0; left:0; }
        }
        &:hover img { -moz-transform:scale(1.1); -o-transform:scale(1.1); transform:scale(1.1); }
    }
    &link { padding:5px 10px 5px; color:#fff; background:rgba(0,0,0,.3); position:absolute; top:auto; right:0; bottom:-25px; left:0; -webkit-transition:bottom 0.3s ease-in-out; -moz-transition:bottom 0.3s ease-in-out; -o-transition:bottom 0.3s ease-in-out; transition:bottom 0.3s ease-in-out;
        a { font-size:14px; line-height:22px; display:inline-block; }
        .sideinfo { color:@borderc; }
    }
    &info { font-size:12px; color:@greyc; text-align:right; white-space:nowrap; text-overflow:ellipsis; overflow:hidden; .clear();
        span,em { .fl(); margin-right:10px; font-style:normal;
            &::before { margin-right:3px; font-size:16px; font-family:iconfont; vertical-align:middle; }
            &.view:before { content:"\e6a7"; }
            &.cmt:before { content:"\e6a8"; }
            &.date:before { content:"\e69c"; }
        }
        em span { float:none; }
    }
    &cmt {
        &info { font-size:13px; color:@greyc; text-align:right; .clear();
            em { .fl(); color:@subc; font-style:normal;
                &::before { content:"\e6a9"; font-size:17px; font-family:iconfont; vertical-align:top; }
            }
        }
        &con { max-height:44px; margin:5px 0; padding:5px 10px; font-size:13px; color:@greyc; line-height:22px; border:1px solid #eee; border-radius:3px; background:#f7f7f7; overflow:hidden; position:relative; display:-webkit-box; -webkit-box-orient:vertical; -webkit-line-clamp:2; }
        &article { white-space:nowrap; text-overflow:ellipsis; overflow:hidden;
            a { font-size:13px; color:@c;
                &::before { content:"\e6e2"; font-size:18px; font-family:iconfont; vertical-align:bottom; }
            }
        }
    }
}
#tpure_RecArticle {
    .sideitem { margin-bottom:10px; padding:0; border:0;
        &:last-child { margin:0; }
    }
    .noimg { margin-bottom:10px; padding-bottom:8px; border-bottom:1px dotted @borderc; border-radius:0; }
}
#hcsticky .sidebox:last-child { margin-bottom:0; }
#divTags {
    ul { margin-left:-8px; }
    li { width:auto; .fl(); margin:10px 0 0 8px; padding:0; white-space:nowrap; border:0;
        a { padding:0 8px; font-size:14px; color:@subc; line-height:28px; border-radius:3px; box-shadow:0 1px 1px 0 #f5f5f5; border:1px solid @borderc; .zoom; }
    }
}
.tag-count { display:none; }
#divTags ul li a:hover { text-decoration:none; color:@c; border:1px solid @c; }
#divCalendar {
    .function_t { display:none; }
    .function_c { width:232px; padding:0 4px 15px 4px; }
    table { width:100%; font-size:14px; table-layout:fixed; }
    caption { height:24px; margin:0 0 10px; padding:0; font-weight:bold; text-align:center;
        a { padding:0 18px; color:#8a9ead; }
    }
    th { height:26px; color:#fff; font-weight:normal; line-height:26px; text-transform:uppercase; border:1px solid #b6c5d0; background:#b6c5d0; }
    td { height:30px; color:@greyc; line-height:30px; text-align:center; border:1px solid @borderc; }
    td.pad { background:none; }
    td a { line-height:30px; color:@c; border:1px solid @c; display:block; }
    #today{ color:@c; font-weight:bold; }
}
#divAuthors {
    .article-nums { display:none; }
}
#divPrevious .article-date,#divNavBar .subnav { display:none; }
#divCatalog ul {
    &.ul-subcates li a { padding-left:37px; }
}
#divSearchPanel form { margin-top:20px; .clear(); }
#divSearchPanel input[type="text"]{ width:70%; height:36px; .fl(); padding:5px 10px; line-height:21px; border:1px solid @borderc; box-sizing:border-box; border-radius:3px; transition:border-color 0.15s ease-in-out, box-shadow 0.15s ease-in-out;
    &:focus { color:#495057; background-color:#fff; border-color:#aab7c1; outline:0; box-shadow:0 0 0 0.2rem rgba(31, 73, 119, 0.1); }
}
#divSearchPanel input[type="submit"]{ width:22%; height:36px; .fr(); line-height:24px; border:1px solid @borderc; border-radius:3px; cursor:pointer; background:#fff;
    &:focus { background:@borderc; }
}
#divMisc ul li,#divFavorites ul li,#divStatistics ul li { width:50%; .fl(); overflow:hidden; }
#divMisc {
    li {
        a { padding:5px 0; background:none; .zoom;
            img { display:block; }
        }
    }
}
#divNavBar, #divCatalog, #divLinkage, #divFavorites, #divArchives, #divAuthors {
    li { width:50%; height:36px; float:left; line-height:36px; border-bottom:1px dotted @borderc; overflow:hidden; }
}
#divCatalog,#divPrevious,#divLinkage,#divNavBar,#divComments,#divAuthors,#divFavorites,#divStatistics {
    li { height:36px; line-height:36px; border-bottom:1px dotted @borderc; white-space:nowrap; text-overflow:ellipsis; overflow:hidden;
        &::before { content:"\e6a6"; margin:0 5px 0 0; font-size:12px; color:@subc; font-family:iconfont; .zoom; }
    }
}
#divContorPanel {
    dd { text-align:center; }
    .cp-hello { width:100%; margin-bottom:15px; padding:10px 0; border-bottom:1px dotted @borderc; display:inline-block;
        &::before { content:"\e6a9"; margin-right:3px; font-size:22px; font-family:iconfont; .zoom; }
    }
    .cp-login,.cp-vrs {
        a { padding:0 16px 0 10px; font-size:14px; color:@greyc; border:2px solid #e4e8eb; border-radius:20px; display:inline-block;
            &::before { font-size:20px; font-family:iconfont; vertical-align:top; }
            &:hover { color:@c; border-color:@c;
                &::before { color:@c; }
            }
        }
    }
    .cp-login {
        a {
            &::before { content:"\e699"; }
        }
    }
    .cp-vrs {
        a {
            &::before { content:"\e6e2"; }
        }
    }
}
#divContorPanel {
    .sidecon {
        div { padding:20px; text-align:center; line-height:24px; border:1px dotted #f0f0f0; background:#fbfbfb; }
    }
}
#divArchives a { font-size:14px; }
#tpure_User { padding:0;
    dt { display:none; }
}
#tpure_Readers { padding-bottom:10px;
    ul { margin-left:-3%; }
    li { width:22%; margin:0 0 3% 3%; padding-top:8px; text-align:center; line-height:1.5; border:0; .zoom; }
}
.reader {
    &img { margin-bottom:5px; display:block;
        img { width:48px; height:48px; margin:0 auto; border-radius:50%; display:block; }
    }
    &name { font-size:14px; color:@subc; .nowrap; display:block; }
    &num { font-size:12px; color:#999; line-height:20px; display:block;
        &::before { content:"\e6a8"; margin:0 3px 0 0; font-size:18px; color:#999; font-family:iconfont; .zoom; }
    }
    &s {
        ul { margin-left:-3%; font-size:0; }
        li { width:30.33%; margin:0 0 3% 3%; padding:10px; border:1px solid #f1f1f1; border-radius:5px; box-sizing:border-box; .shadow; overflow:hidden; position:relative; .zoom; .clear();
            a { display:block;
                &::after { content:"\e6e9"; font-size:16px; color:#ccc; font-family:iconfont; position:absolute; top:-2px; right:5px; }
            }
            &.top { padding:15px 10px 10px;
                .readersimg { float:none;
                    img { width:60px; height:60px; margin:0 auto; }
                }
                .readersinfo { margin-top:8px; padding:0; text-align:center; }
                &:nth-child(1) .honor { background:#df951a; }
                &:nth-child(2) .honor { background:#91a3a7; }
                &:nth-child(3) .honor { background:#d98a63; }
                a::after { display:none; }
            }
            .honor { width:100px; height:22px; font-size:12px; color:#fff; text-align:center; line-height:22px; background:#0c60ee; position:absolute; top:10px; right:-29px; -moz-transform:rotate(45deg); -webkit-transform:rotate(45deg); -o-transform:rotate(45deg); -ms-transform:rotate(45deg); transform:rotate(45deg); }
        }
        &img { .fl(); margin-right:10px;
            img { width:48px; height:48px; border-radius:50%; display:block; }
        }
        &info { padding-left:60px; font-size:12px; color:#888; line-height:25px; display:block;
            span { font-size:16px; color:@subc; .nowrap; display:block; }
        }
    }
}
.sideuser {
    &head { height:110px; margin-bottom:20px; border-radius:3px 3px 0 0; background-repeat:no-repeat; background-size:cover; background-position:center; }
    &con { text-align:center;
        .avatar { width:90px; height:90px; margin:-70px auto 5px; padding:5px; border-radius:50%; box-sizing:border-box; background:rgba(255,255,255,.3); overflow:hidden;
            img { width:80px; height:80px; border-radius:50%; }
        }
        h4 { padding:0 20px; font-size:18px; color:@subc; font-weight:600; }
        p { padding:0 20px; font-size:14px; color:@greyc; line-height:24px; }
    }
    &link { padding:20px; font-size:0;
        p { width:20%; padding:0; .zoom;
            a { width:36px; height:36px; text-align:center; line-height:36px; border-radius:50%; position:relative; display:inline-block;
                &::after { font-family:iconfont; }
                &.qq { border:1px solid #12b7f5;
                    &::after { content:"\e60f"; font-size:28px; color:#12b7f5; }
                }
                &.wechat { border:1px solid #4cbf2a;
                    span { width:120px; margin-left:-70px; padding:15px 10px 10px; border-top:2px solid @c; box-shadow:0 0 2px 0 #bbb; background:#fff; position:absolute; bottom:50px; left:50%; z-index:30; display:none;
                        &::before { content:""; width:0; height:0; margin:-21px 0 0 -10px; border:10px solid transparent; border-top-color:@borderc; border-bottom-color:transparent; position:absolute; bottom:-20px; left:50%; z-index:3; }
                        &::after { content:""; width:0; height:0; margin:-20px 0 0 -10px; border:10px solid transparent; border-top-color:#fff; border-bottom-color:transparent; position:absolute; bottom:-18px; left:50%; z-index:3; }
                        img { width:100%; display:block; }
                    }
                    &::after { content:"\e610"; font-size:32px; color:#4cbf2a; }
                }
                &.email { border:1px solid #f9671c;
                    &::after { content:"\e617"; font-size:20px; color:#f9671c; }
                }
                &.weibo { border:1px solid #e6162d;
                    &::after { content:"\e612"; font-size:32px; color:#e6162d; }
                }
                &.group { border:1px solid #38638c;
                    &::after { content:"\e604"; font-size:24px; color:#38638c; }
                }
            }
        }
    }
    &foot { border-top:1px solid @borderc; border-radius:0 0 3px 3px; background:#f8f8f8; .clear();
        p { width:33.333%; .fl(); padding:10px 0; line-height:20px; position:relative;
            &:not(:last-child) {
                &::after { content:""; width:1px; height:40px; background:@borderc; position:absolute; top:10px; right:0; }
            }
            strong { font-size:18px; color:@subc; font-weight:600; }
            span { font-size:14px; color:@greyc; display:block; }
        }
    }
}

.tagscloud { margin-left:-2%; font-size:0;
    li { width:23%; margin:0 0 2% 2%; background:#f5f5f5; position:relative; .zoom;
        a { width:100%; padding:0 50px 0 10px; font-size:14px; color:@subc; box-sizing:border-box; white-space:nowrap; text-overflow:ellipsis; overflow:hidden; display:block; transition:background-color 0s linear,color 0s linear; }
        span { font-size:12px; color:#999; font-family:arial; line-height:28px; position:absolute; top:0; right:10px; z-index:1; }
        &:hover { color:#fff; background:@c;
            a,span { color:#fff; }
        }
    }
}
.tagsnull { padding:10% 0; color:@greyc; text-align:center;
    &::before { content:"\e869"; margin-bottom:10px; font-size:100px; color:@borderc; font-family:iconfont; line-height:1; display:block; }
}

.archive {
    &date { margin-bottom:10px; font-size:16px; color:@c; border-bottom:1px solid @borderc; }
    &list {
        li { line-height:28px; .clear(); }
        h3 { margin:0; padding:0; font-size:14px; line-height:inherit; border:0; text-overflow:ellipsis; white-space:nowrap; overflow:hidden;
            a { font-size:14px; color:@subc;
                &:hover { color:@c; }
            }
            &::after { display:none; }
        }
    }
    &time { .fl(); margin-right:10px; font-size:14px; color:#999; }
}
.archivenull { padding:20% 0; color:@greyc; text-align:center;
    &::before { content:"\e869"; margin-bottom:10px; font-size:100px; color:@borderc; font-family:iconfont; line-height:1; display:block; }
}

.footer { padding:20px 17px; font-size:14px; color:#999; text-align:center; line-height:24px; border-top:1px solid #dbe0e8; background:@borderc;
    a { font-size:14px; color:#999;
        &:hover { color:@c; }
    }
}

a.backtotop { width:45px; height:45px; margin-left:550px; text-align:center; line-height:45px; border-radius:5px; cursor:pointer; opacity:.8; background:rgba(10,10,10,.2); overflow:hidden; position:fixed; _position:absolute; right:30px; bottom:30px; _bottom:30px; z-index:3;
    i {
        &::after { content:"\e600"; font-size:32px; color:#fff; font-family:iconfont; }
    }
    &:hover { background:@c; }
}
a.setnight { width:45px; height:45px; margin-left:550px; text-align:center; line-height:45px; border-radius:5px; cursor:pointer; opacity:.8; background:rgba(10,10,10,.2); overflow:hidden; position:fixed; _position:absolute; right:30px; bottom:88px; _bottom:88px; z-index:3;
    &::after { content:"\e6e4"; font-size:36px; color:#fff; font-family:iconfont; }
    &.black:after { content:"\e635"; }
    &:hover { background:@c; }
}

.errorpage{ padding:100px 30px; text-align:center; box-shadow:0 1px 5px 0 rgba(0, 0, 0, 0.05); box-sizing:border-box; background:#fff;
    h3 { margin:0 0 10px; font-size:120px; line-height:120px; font-weight:bold; color:@subc; text-shadow:rgba(61,61,61,.3) 1px 1px,rgba(61,61,61,.2) 2px 2px,rgba(61,61,61,.3) 3px 3px; }
    h4 { margin:0 0 30px; font-size:30px; color:@subc; line-height:35px; }
    p { margin:0 0 20px; font-size:16px; color:@subc; }
}
.errorsearch { width:60%; margin:0 auto 20px; .clear(); }
.errschtxt { width:75%; height:36px; .fl(); padding:5px 10px; line-height:21px; border:1px solid @borderc; box-sizing:border-box; border-radius:3px; transition:border-color 0.15s ease-in-out, box-shadow 0.15s ease-in-out;
    &:focus { color:#495057; background-color:#fff; border-color:#aab7c1; outline:0; box-shadow:0 0 0 0.2rem rgba(31, 73, 119, 0.1); }
}
.errschbtn { width:24%; height:36px; .fr(); line-height:24px; border:1px solid @borderc; border-radius:3px; cursor:pointer; background:#fff;
    &:focus { background:@borderc; }
}
.goback { height:36px; margin:0 10px 0 0; padding:0 10px 0 20px; font-size:16px; color:@greyc; line-height:36px; border:2px solid @borderc; outline:0; border-radius:20px; cursor:pointer; background:#fff; display:inline-block;
    &::after { content:"\e6a6"; font-size:23px; color:@greyc; font-family:iconfont; vertical-align:top; }
    &:hover { color:@c; border-color:@c;
        &::after { color:@c; }
    }
}

//阅读更多
.viewall{ overflow:hidden; position:relative; }
.teles,.telesmore{ width:100%; height:150px; color:@c; text-align:center; font-size:14px; text-indent:0em; cursor:pointer; background:linear-gradient(to bottom, rgba(255,255,255,0), #fff 50%); position:absolute; left:0; bottom:0; display:block; }
.telesmore i { margin:80px auto 0; line-height:36px; text-align:center; border:1px solid @c; border-radius:3px; background:#fff; display:block; }
.telesmore i:after { content:"\e69b"; font-size:22px; font-family:iconfont; .zoom; -webkit-animation:telesmoreico .4s infinite alternate; }
.teles i{ margin:72px 0 20px; font-size:16px; font-style:normal; text-indent:0em; line-height:28px; display:inline-block; }
.teles i:after { content:"\e69b"; width:33px; margin-left:-20px; font-size:30px; font-family:iconfont; position:absolute; bottom:24px; left:50%; -webkit-animation:telesico .4s infinite alternate; -ms-animation:telesico .4s infinite alternate; }
@-webkit-keyframes telesico{0%{-webkit-transform:translate(0px, -2px);}100%{-webkit-transform:translate(0px,3px);}}
@-webkit-keyframes telesmoreico{0%{-webkit-transform:translate(0px, -2px);}100%{-webkit-transform:translate(0px,3px);}}
@-webkit-keyframes arrow{ from{ -webkit-transform:translate3d(-webkit-calc(-50% + 6px),5px,0); transform:translate3d(calc(-50% + 6px),5px,0)} to { -webkit-transform:translate3d(-webkit-calc(-50% + 6px),0,0); transform:translate3d(calc(-50% + 6px),0,0) } }
@keyframes arrow{ from{ -webkit-transform:translate3d(-webkit-calc(-50% + 6px),5px,0); transform:translate3d(calc(-50% + 6px),5px,0)} to { -webkit-transform:translate3d(-webkit-calc(-50% + 6px),0,0); transform:translate3d(calc(-50% + 6px),0,0) } }

.close {
    &page { background:#f1f1f1; }
    &site { width:750px; margin:0 auto; padding:30px 40px; box-sizing:border-box; .shadow; background:#fff; position:absolute; top:50%; left:50%; z-index:1; transform:translate(-50%, -50%);
        h1 { margin:0 0 20px -40px; padding-left:33px; font-size:28px; color:#333; font-weight:600; border-left:5px solid @c; }
        &bg { width:100%; height:100%; background-repeat:no-repeat; background-size:cover; background-position:center; position:fixed; top:0; right:0; bottom:0; left:0; z-index:0;
            &.bgmask::before { content:""; width:100%; height:100%; background:rgba(0,0,0,.5); position:absolute; top:0; left:0; z-index:1; }
        }
    }
    &logo { margin-bottom:20px; font-size:16px; color:#999;
        img { width:100px; }
    }
    &con { font-size:16px; color:#666; text-align:justify; line-height:1.9; }
}

.night { background:rgba(25,25,25,1);
    .wrap {
        &per { background:rgba(25,25,25,1); }
    }
    .head {
        &er { border-bottom:1px solid #222; box-shadow:0 1px 4px 0 rgba(22,22,22,1); background-color:rgba(32,32,32,1); -webkit-backdrop-filter:blur(10px); backdrop-filter:blur(10px);
            .name {
                a, { color:#ccc; }
            }
        }
    }
    .logo.on a:before { content:''; position:absolute; top:0; left:-75%; z-index:2; display:block; width:50%; height:100%; background:-webkit-linear-gradient(left, rgba(32, 32, 32, 0) 0%, rgba(32, 32, 32, .5) 100%); background:linear-gradient(to right, rgba(32, 32, 32, 0) 0%, rgba(32, 32, 32, .5) 100%); -webkit-transform:skewX(-17deg); -moz-transform:skewX(-17deg); -o-transform:skewX(-17deg); -ms-transform:skewX(-17deg); transform:skewX(-17deg); }
    .sign {
        &user {
            .uname { color:#bbb; }
            &.normal {
                &:hover { background:#262626; }
            }
            &pop { background:#262626; }
            &menu {
                a { color:#bbb;
                    &:hover { color:#fff; background:@c; }
                }
            }
        }
    }
    .menu {
        li {
            a { color:#bbb; }
            &.subcate {
                .subnav {
                    a { color:#bbb; }
                }
            }
            .subnav { box-shadow:0 0 2px 0 #151515; background:#262626;
                a { border-color:#3a3a3a; }
                &::after { color:#bbb; border-bottom-color:#262626; }
            }
        }
        &ico.on {
            span { background-color:#ccc; }
        }
    }
    .sch {
        &ico {
            a {
                &::after { color:#ccc; }
            }
        }
        &fixed { box-shadow:0 0 2px 0 #151515; background:#262626;
            input { color:#ccc; border-color:#3a3a3a; background:#202020; }
            &::after { border-bottom-color:#262626; }
        }
    }
    .searchnull {
        &::before { color:#3a3a3a; }
    }
    .main, .indexcon { background:rgba(25,25,25,1); }
    .single {
        h1,h2,h3,h4,h5,h6 { border-color:#3a3a3a; }
        p.ue-upload { border-color:#3a3a3a; }
        blockquote { color:#888; border-color:#444; background:#232323;
            &::before { color:#555; }
        }
        td { color:@greyc; border-color:#3a3a3a; }
        code[class*="language-"], pre[class*="language-"] { text-shadow:0 1px #3a3a3a; background:@subc; }
        div.prism-show-language>div.prism-show-language-label[data-language] { background:#666; }
        table { background:#232323; }
    }
    .copynotice { color:#888; border-color:#444; background:#232323;
        b,strong { color:#bbb; }
        a { color:#888; }
    }
    .auth {
        &img { border-color:#3c3c3c; }
        &info {
            h1 { color:#bbb; }
        }
    }
    .filter {
        &nav { border-color:#3a3a3a;
            h1,li { color:#bbb; }
            li.active { color:@c; }
        }
    }
    .post { border-bottom:1px solid #3a3a3a;
        &title { border-color:#3a3a3a;
            h1,h2,h3,h4,h5,h6 { color:#bbb; }
        }
        h1 { color:#bbb; }
        h2 {
            a { color:#bbb;
                &:hover { color:@c; }
            }
        }
        .intro { color:@greyc; }
        .readmore { border-color:#444; background:#232323;
            &:hover { border-color:@c; }
        }
        .single { color:@greyc; border-color:#3a3a3a; }
        .tags {
            a { color:@greyc; border-color:#3a3a3a; background:none; }
        }
        .ctrl {
            a { background:#3a3a3a; }
        }
    }
    .telesmore i { background:#262626; }
    .teles, .telesmore { background:linear-gradient(to bottom, rgba(38,38,38,0), #262626 50%); }
    .pagination-loading { background:#262626; }
    .ias_trigger, .ias_loader {
        a { border-color:#3a3a3a; background:#262626; }
    }
    .pages { color:@greyc;
        a { color:#bbb;
            &:hover { color:@c; border-color:@c; }
        }
    }
    a.backlist { color:@greyc; border-color:@greyc; }
    .relate { border-color:#3a3a3a;
        &info {
            h3 { color:#bbb;
                a { color:#bbb;
                    &:hover { color:@c; }
                }
            }
        }
        &list { border-color:#3a3a3a;
            a { color:#bbb;
                &:hover { color:@c; }
            }
            span { color:@greyc; }
        }
    }
    .cmt {
        &form { border-color:#3a3a3a;
            label { color:@greyc; }
            input { color:#ccc; border-color:#3a3a3a; background:#202020;
                &:focus { color:@c; }
            }
            img.imgcode { border-color:#3a3a3a; }
        }
    }
    .cmtarea textarea { color:#ccc; border-color:#3a3a3a; background:#202020; }
    .cmtsubmit {
        button { border-color:@greyc; background:none;
            &:hover { border-color:@c; }
        }
    }
    .cmts {
        &name { color:@greyc;
            a { color:@greyc; }
        }
        &date { color:@greyc; }
        &body { color:#ccc; }
        &reply { border-color:#3a3a3a;
            &name {
                a { color:@greyc; }
            }
            &con { color:#ccc; }
            &date { color:@greyc; }
        }
        &item { border-color:#3a3a3a; }
    }
    .reply-frm { border-color:#3a3a3a; }
    #cancel-reply { color:@c; border-color:@c; background:none; }
    .tagscloud {
        li { background:#3a3a3a;
            a { color:#bbb; }
            &:hover {
                a { color:#fff; }
            }
        }
    }
    .archive {
        &date { border-color:#3a3a3a; }
        &list {
            h3 {
                a { color:#bbb;
                    &:hover { color:@c; }
                }
            }
        }
    }
    .side {
        &box {
            dt { color:#bbb; border-bottom:1px solid #3a3a3a; }
            dd {
                a { color:#888; }
                .sideitem .itemtitle { color:#bbb;
                    &:hover { color:@c; }
                }
                .sidelink a { color:#fff;
                    &:hover { color:@c; }
                }
                .sidecmtarticle a { color:#bbb;
                    &:hover { color:@c; }
                }
            }
        }
        &item { border-color:#3a3a3a;
            .hasimg { color:#bbb; }
        }
        &link {
            .sideinfo { color:#bbb; }
        }
        &cmt {
            &info em { color:#bbb; }
            &con { border:1px dotted #444; background:#232323; }
        }

    }
    #tpure_RecArticle .noimg,.sideuserfoot,.friendlink span { border-color:#3a3a3a; }
    #divContorPanel .cp-hello { color:@greyc; border-color:#3a3a3a; }
    #divContorPanel .cp-login, #divContorPanel .cp-vrs {
        a { border-color:@greyc;
            &:hover { border-color:@c; }
        }
    }
    #divCatalog li, #divPrevious li, #divLinkage li, #divNavBar li, #divComments li, #divAuthors li, #divFavorites li, #divStatistics li { border-bottom:1px dotted #3a3a3a; }
    #divCatalog li:before, #divPrevious li:before, #divLinkage li:before, #divNavBar li:before, #divComments li:before, #divAuthors li:before, #divFavorites li:before, #divStatistics li:before { color:@greyc; }
    #divTags li a { color:@greyc; border-color:#3a3a3a; box-shadow:none; }
    .sideusercon h4,.sideuserfoot p strong,.friendlink span,.friendlink li a { color:#bbb; }
    .block,.friendlink,.sidebox,.pagebar, .cmtpagebar,.sideuserfoot { background:#262626; }
    .sideuserfoot p:not(:last-child):after { background:#3a3a3a; }
    .reader {
        &name { color:#bbb; }
        &s {
            li { border-color:#505050; background:#333;
                a::after { color:#888; }
            }
            &info {
                span { color:#bbb; }
            }
        }
    }
    .pagebar, .cmtpagebar {
        a { color:#bbb; border-color:#3a3a3a; background:none; }
    }
    .foot {
        &er { border-top:1px solid #3a3a3a; background:rgba(32,32,32,1); }
    }
    .lazynum { color:#999; background:#444; }
    a.backtotop,.setnight { background:rgba(68,68,68,.8); }
    a.backtotop:hover { background:@c; }
    .errorpage { background:#262626;
        h3,h4,p { color:#bbb; }
        .errschtxt { color:#ccc; border-color:#3a3a3a; background:#202020;
            &:focus { color:@c; }
        }
        .errschbtn { color:#fff; border-color:@c; background:@c; }
        .goback { color:@greyc; border-color:@greyc; background:none;
            &:hover { color:@c; border-color:@c; }
        }
    }
    .advice_content,.advice_contactcon,.advice_verifycode { border-color:#3a3a3a; }
    .advice_content textarea,.advice_contactcon input { color:#ccc; background:#202020; display:block; }
    .advice_verifycode { color:#ccc; background:#202020; }
}

@media screen and (max-width:1920px){
    .wrap { width:1080px; }
    .wrapper { width:100%; min-width:100%; }
    a.backtotop { left:50%; bottom:30px; _bottom:30px; }
    a.setnight { left:50%; bottom:80px; _bottom:80px; }
}

@media screen and (max-width:1200px){
    .wrap { width:auto; padding:0 20px; }
    .header {
        .wrap { padding:0; }
        .name a { padding-left:18px; }
    }
    .logo { margin-left:20px; }
    .head { padding:0; }
    .schico { right:10px; }
    .banner {
        h2 { width:80%; }
    }
    a.backtotop { width:36px; height:36px; margin:auto; line-height:36px; right:10px; bottom:30px; left:auto;
        i {
            &::after { font-size:26px; }
        }
    }
    a.setnight { width:36px; height:36px; margin:auto; line-height:36px; right:10px; bottom:72px; left:auto;
        &::after { font-size:30px; }
    }
}

@media screen and (max-width:1080px){
    .header {
        .name { height:50px;
            a { font-size:20px; line-height:50px; }
        }
    }
    .logo { height:50px; margin-left:10px;
        a { height:50px;
            img { height:36px; }
        }
    }
    .sign { line-height:50px;
        span { margin-top:10px; }
        &user { margin:0; padding-top:8px; line-height:40px;
            &pop { top:48px; }
        }
    }
    .menu { width:100%; height:auto; float:left; margin:0; border-top:1px solid #111; display:none;
        ul { width:100%; padding-right:0; border-left:0;
            li { width:100%; padding:0; color:#ddd; line-height:40px; border-bottom:1px solid #111; border-right:0;
                &::before { display:none; }
                a { padding:0 18px; font-size:16px; color:@subc; border:0; display:block; }
                &.subcate {
                    &:hover {
                        .subnav { display:none; }
                    }
                    &>a:after { content:"\e69b"; margin-left:10px; font-size:16px; color:@greyc; font-family:iconfont; font-weight:600; position:absolute; top:0; right:16px; }
                    &.slidedown {
                        &>a:after { content:"\e6a4"; color:@c; }
                        .subnav { margin-bottom:-1px; padding:0; line-height:40px; border-top:1px solid @borderc; border-bottom:1px solid @borderc; box-shadow:none; background:#fafafa; position:static; display:block; -webkit-animation:fadeInUp 0s 0s ease both; -moz-animation:fadeInUp 0s 0s ease both;
                            &::before,&::after { display:none; }
                            a { padding:0 18px; }
                        }
                    }
                }
            }
        }
        &.on { width:100%; margin:0; padding:5px 0 0; display:block; }
    }
    .menuico { right:5px; display:block; }
    .sch {
        &ico { display:none; }
        &-m { display:block; }
    }
    .main {
        &.fixed { padding-top:50px; }
    }
    .banner { margin-bottom:20px; }
    .indexcon { padding-top:0; }
    .post {
        &img { width:120px; }
        .intro { max-height:85px; .clamp(3); }
    }
    .large {
        .post {
            &img { width:120px; }
            .intro { max-height:85px; .clamp(3); }
        }
    }
    .sidebar { display:none; }
    .content { width:100%; }
    .night {
        .menu {
            &.on { border-color:#3a3a3a; background:#262626;
                li { border-color:#3a3a3a; }
            }
            ul li.subcate.slidedown .subnav { border-color:#3a3a3a; background:#202020; }
        }
    }
}

@media screen and (max-width:750px){
    .wrap { padding:0; }
    .main { padding-bottom:10px;
        .mask { margin-bottom:10px; }
    }
    .banner { margin-bottom:10px; font-size:24px; line-height:32px;
        h2 { margin-bottom:10px;
            &::after { bottom:-10px; }
        }
    }
    .slideblock { margin-bottom:0; }
    .swiper-container-horizontal>.swiper-pagination-bullets, .swiper-pagination-custom, .swiper-pagination-fraction { bottom:0; }
    .swiper-container-horizontal>.swiper-pagination-bullets .swiper-pagination-bullet { margin:0 2px; }
    .swiper-pagination-bullet { width:14px; height:2px; padding:10px 0; border-radius:2px; opacity:1; }
    .swiper-button-prev,.swiper-button-next { display:none; }
    .indexcon { padding-top:0;
        .swiper-container-horizontal>.swiper-pagination-bullets, .swiper-pagination-custom, .swiper-pagination-fraction { bottom:0; }
    }
    .sitemap { padding:0 18px; }
    .auth {
        &img { width:80px; height:80px; float:none; margin:0 auto 10px; display:block;
            img { width:80px; height:80px; }
            .sex { right:0; bottom:0; }
        }
        &info { margin-bottom:6px; padding:0; text-align:center;
            h1 { font-size:20px; }
            p { -webkit-line-clamp:unset; }
        }
    }
    .filter { width:100%;
        &nav { .clear();
            h1 { display:none; }
        }
        li { width:33.33%; padding:0; line-height:18px; text-align:center;
            i { margin:0; }
        }
    }
    .block { margin-bottom:10px; padding:20px 18px 10px; }
    .post { margin-bottom:20px; padding-bottom:10px;
        h1,h2 { font-size:20px; line-height:30px;
            a { font-size:20px; }
            .istop {
                &::before { font-size:32px; }
            }
        }
        .info { margin-bottom:10px; }
        .readmore { width:100%; padding:5px 0; text-align:center; display:none; }
        &title {
            h1,h2,h3,h4,h5,h6 { font-size:18px; }
        }
        .user,.date,.cate,.view,.cmt { margin-bottom:5px; line-height:20px; .zoom;
            &::before { margin-right:2px; font-size:20px; }
        }
        .datetime { display:none; }
        &.intro {
            &.isimg { height:auto; }
        }
        .ctrl { float:none;
            a { margin:0 8px 0 0; }
        }
    }
    .pagebar { padding-bottom:10px; }
    .cmtpagebar { padding-bottom:0; }
    .pagebar,.cmtpagebar {
        .now-page { padding:0 5px; }
        .next-page { display:inline-block;
            a { display:inline-block; }
        }
        a { margin:0 3px 5px; padding:1px 7px; display:none;
            &.m { display:inline-block; }
        }
    }
    .ias_trigger, .ias_loader { margin-bottom:10px; }
    //.single { font-size:18px; line-height:30px; }
    .copynotice { word-break:break-all; flex-direction:column; justify-content:space-between; align-items:center;
        .qr,canvas { float:none; margin:5px 0; }
    }
    a.backlist { width:99%; float:none; margin:0 0 20px; padding:0; line-height:36px; text-align:center; display:block; }
    //.relate:last-child { padding:20px 0; }
    .tagscloud li { width:48%; }
    .relate {
        &:last-child { padding:20px 0; }
        &con.diallel {
            .relatelist { width:100%; float:none; display:block;
                &:nth-child(even) { float:none; display:block; }
            }
        }
    }
    .relateinfo {
        h3 { margin-bottom:8px;
            a { font-size:18px; }
        }
    }
    .relatelist {
        a { width:100%; margin:0; white-space:normal; }
        .posttime { position:static; }
        &:last-child { border:0; }
    }
    .cmt {
        &s {
            &item {
                .avatar { width:38px; height:38px;
                    img { width:38px; height:38px; }
                }
            }
            &con { margin-left:50px; }
            &head { .clear(); }
            &name { width:100%; .fl(); }
            &date { .fl(); }
            &body,&reply { margin-left:-50px; }
            &foot { margin-left:-50px; text-align:right; }
        }
        &area { padding:0; }
        &form {
            p { width:100%; }
            input { width:60%; }
            #inpVerify { width:30%; }
            img.imgcode { width:calc(~"30% - 12px"); border-radius:3px; }
        }
        &img { display:none; }
        &submit { text-align:center;
            button { width:100%; height:40px; margin:0 0 10px 0; }
        }
    }
    .reply-frm { margin-left:-50px; }
    .friendlink { margin-top:10px; padding:15px 18px 10px;
        span { font-size:18px; }
        ul { margin-left:-3%; }
        li { width:22%; margin:0 0 3% 3%; font-size:12px; .nowrap; }
    }
    .readers {
        li { width:47%; padding:15px 10px 10px;
            img { width:60px; height:60px; }
        }
        &img { float:none;
            img { margin:0 auto; }
        }
        &info { margin-top:8px; padding:0; text-align:center; line-height:20px; }
    }
    .error {
        &page { padding:50px 18px;
            h3 { font-size:80px; line-height:80px; }
            h4 { font-size:24px; }
        }
        &search { width:100%; }
    }
    .close {
        &page { padding:1px 0; }
        &site { width:90%; margin:5%; padding:20px; position:relative; top:auto; left:auto; transform:none;
            h1 { margin:0 0 20px -20px; padding-left:15px; font-size:22px; }
        }
    }
    .night {
        .advice_content,.advice_contactcon,.advice_verifycode { border-color:#3a3a3a; }
        .advice_content textarea,.advice_contactcon input { color:#ccc; background:#202020; display:block; }
        .advice_verifycode { color:#ccc; background:#202020; }
    }
}